<div id="orderOfferFormDiv"></div>
<style>
  #orderOfferForm .layui-form-label {
    width: 110px;
  }
  #orderOfferForm .layui-input-block {
    margin-left: 130px;
  }
</style>
<script type="text/html" id="orderOfferFormContent">
  <form lay-filter="orderOfferForm" id="orderOfferForm" class="layui-form open-form">
    <div class="open-model">
      <div class="open-auto">
        <div class="layui-form-item layui-row">
          <input name="id" type="hidden" />
          <!--                <button class="layui-btn" type="button" id="addOffer">添加报价</button>-->
          <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">客户名称</label>
            <div class="layui-input-block">
              <input name="customerName" disabled class="layui-input" type="text" />
            </div>
          </div>
          <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">客户联系人</label>
            <div class="layui-input-block">
              <input name="customerContactsName" disabled class="layui-input" type="text" />
            </div>
          </div>
          <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">联系人电话</label>
            <div class="layui-input-block">
              <input name="customerContactsPhone" disabled class="layui-input" type="text" />
            </div>
          </div>
          <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">交货时间</label>
            <div class="layui-input-block">
              <input name="deliveryTime" disabled class="layui-input" type="text" />
            </div>
          </div>
        </div>
        <div class="layui-form-item layui-row">
          <!-- <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">所属渠道</label>
            <div class="layui-input-block">
              <input name="channelName" disabled class="layui-input" type="text" />
            </div>
          </div> -->
          <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">订单类型</label>
            <div class="layui-input-block">
              <select name="orderType" lay-verify="required" disabled>
                <option value="trial">询价订单</option>
                <option value="mass">量产订单</option>
              </select>
            </div>
          </div>
          <div class="layui-inline layui-col-md3">
            <input name="checkerName" type="hidden" />
            <label class="layui-form-label">询价审核人</label>
            <div class="layui-input-block">
              <input name="checkerId" disabled class="layui-input" type="text" />
            </div>
          </div>
          <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">订单来源</label>
            <div class="layui-input-block">
              <select name="orderSource" disabled>
                <option value="staff">自主录入/员工录入</option>
                <option value="platform">云端制造/平台指派</option>
                <option value="agent">渠道录入/代理商录入</option>
                <option value="customer">云端智采/客户直接委派</option>
              </select>
            </div>
          </div>
        </div>
        <div class="layui-form-item layui-row">
          <div class="layui-inline layui-col-md3">
            <label class="layui-form-label">报价截止时间</label>
            <div class="layui-input-block">
              <input name="offerEndTime" disabled class="layui-input" type="text" />
            </div>
          </div>
          <table class="layui-table" id="orderOfferFormTable" lay-filter="orderOfferFormTable"></table>
        </div>
      </div>
      <div class="layui-form-item text-right">
        <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">关闭</button>
      </div>
    </div>
  </form>
</script>
<script type="text/html" id="orderOfferFormTableBar">
  <button class="layui-btn  layui-btn-xs" type="button" lay-event="detail">详情</button>
  <!-- {{# if(d.status != "finish"){ }} -->
  <!-- {{# if(!d.whetherFinal){ }} -->
  <button class="layui-btn layui-btn-danger layui-btn-xs" type="button" lay-event="setFinal">设为终版</button>
  <!-- {{# } }} -->
  <!-- {{# } }} -->
</script>
<script>
  layui.use(["layer", "form", "table", "admin", "upload", "tree", "laytpl"], async function () {
    var $ = layui.jquery;
    var layer = layui.layer;
    var form = layui.form;
    var table = layui.table;
    var config = layui.config;
    var admin = layui.admin;
    var laydate = layui.laydate;
    var laytpl = layui.laytpl;
    let nowData = { ...parentData };

    laytpl(orderOfferFormContent.innerHTML).render(nowData, function (html) {
      $("#orderOfferFormDiv").after(html);
    });

    if (nowData.id) {
      const res = await admin.reqPro("enterprise/sell/admin/order/detail/" + nowData.id, {});
      nowData.orderObj = res.data;
      form.val("orderOfferForm", res.data);
      nowData.data.forEach((v) => {
        v.status = nowData.orderObj.status;
        v.orderOfferDetailList.forEach((v1, i1, list1) => {
          if (nowData.orderObj.orderProList.find((v2) => v2.id == v1.proId)) {
            list1[i1] = { ...v1, ...nowData.orderObj.orderProList.find((v2) => v2.id == v1.proId) };
          }
        });
      });
      console.log(nowData.data);
    }

    table.render({
      elem: "#orderOfferFormTable",
      data: [...nowData.data],
      page: false,
      limit: 999999,
      height: 400,
      cols: [
        [
          { type: "numbers", title: "序号" },
          { field: "id", align: "center", title: "报价记录ID", width: 60 },
          { field: "creatorName", align: "center", title: "报价人" },
          { field: "roleName", align: "center", title: "所属岗位" },
          { field: "deptName", align: "center", title: "所属部门" },
          { field: "createTime", align: "center", title: "报价时间" },
          { field: "proNum", align: "center", title: "报价物料数" },
          { field: "totalMoney", align: "center", title: "订单总金额" },
          { field: "remark", align: "center", title: "报价备注" },
          {
            field: "whetherFinal",
            align: "center",
            title: "是否最终报价",
            templet: (d) => {
              return d.whetherFinal ? "是" : "否";
            }
          },
          { field: "updateDuring", align: "center", title: "更新时长" },
          { align: "center", toolbar: "#orderOfferFormTableBar", title: "操作", fixed: "right" }
        ]
      ],
      done: function () {
        console.log(table.cache["orderOfferFormTable"]);

        $(".layui-table-body").css("overflow", "visible");
        $(".layui-table-box").css("overflow", "visible");
        $(".layui-table-view").css("overflow", "visible");
      }
    });
    table.on("tool(orderOfferFormTable)", function (obj) {
      var data = obj.data; // 获取当前行的数据
      var layEvent = obj.event;
      // admin.req('sell/admin/orderOffer/list', {})
      if (layEvent == "detail") {
        admin.formOpen({
          area: ["90%", "85%"],
          offset: ["50px", "5%"],
          title: "报价详情",
          style: "font-size: 20px;",
          path: "components/sell/orderOfferDetailForm.html",
          success: function () {
            parentData = { ...nowData, ...{ offerDetail: data.orderOfferDetailList } };
          }
        });
      } else if (layEvent == "setFinal") {
        layer.confirm(
          "确定设该条记录为终版吗？",
          {
            offset: "65px",
            skin: "layui-layer-admin"
          },
          function () {
            admin.req(
              "enterprise/sell/admin/orderOffer/finalEdition",
              { id: data.id },
              function (res) {
                layer.closeAll("loading");
                if (res.code == 200) {
                  layer.msg(res.msg, { icon: 1 });
                  let list = table.cache["orderOfferFormTable"];
                  list.forEach((v) => {
                    if (v.id == data.id) {
                      v.whetherFinal = true;
                    } else {
                      v.whetherFinal = false;
                    }
                  });
                  table.reload("orderOfferFormTable", { data: list });
                  table.reload("orderTable");
                } else {
                  layer.msg(res.msg, { icon: 2 });
                }
              },
              "POST"
            );
          }
        );
      }
    });
    $("#addOffer").click(() => {
      admin.req("enterprise/sell/admin/order/detail/" + nowData.id, {}, function (res) {
        admin.formOpen({
          area: ["90%", "85%"],
          offset: ["50px", "5%"],
          title: "添加报价",
          style: "font-size: 20px;",
          path: "components/sell/OrderForm.html",
          success: function () {
            parentData.data = res.data;
            parentData.eventName = "quotationRecord";
          }
        });
      });
      // return false;
    });
  });
</script>
<style>
  #orderOfferForm .layui-form-label {
    width: 100px;
  }

  #orderOfferForm .layui-form-item .layui-input-inline {
    width: 130px;
  }

  #orderOfferForm .layui-inline {
    margin-bottom: 10px;
    margin-right: 0px;
  }

  #orderOfferForm .layui-table-cell,
  .layui-table-tool-panel li {
    overflow: visible;
  }
</style>
